<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
    <el-tab-pane label="全部" name="first"></el-tab-pane>
    <el-tab-pane label="待支付" name="second"></el-tab-pane>
    <el-tab-pane label="已关闭" name="third"></el-tab-pane>
    <el-tab-pane label="待确认" name="fourth"></el-tab-pane>
    <el-tab-pane label="学习中" name="five"></el-tab-pane>
    <el-tab-pane label="已完成" name="six"></el-tab-pane>
  </el-tabs>
</template>

<script>
export default {
data() {
      return {
        activeName: 'first'
      };
    },
    methods: {
      handleClick(tab, event) {
        console.log(tab._uid, event.isTrusted);
      }
    }
} 
</script>

<style lang="less">

.el-tabs__nav-wrap{
  background: #fff;
  padding: 30px 60px 0 70px;
  .el-tabs__nav{
    div{
      font-size: 16px;
      color: #333333;
    }
  }
}
.el-tabs__item{
  padding-right: 60px;
}
</style>